<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="圈子管家CRM">
    <meta name="keywords" content="圈子管家, CRM">
    <meta name="author" content="kavalon">
    <title>圈子管家</title>

    <!-- Bootstrap -->
    <link rel="stylesheet" href="plugins/bootstrap/css/bootstrap.min.css">
    <!-- AngularJS csp -->
    <link rel="stylesheet" href="node_modules/angular/angular-csp.css">
    <!-- 全局CSS -->
    <link rel="stylesheet" href="css/global.css">
    <!-- 局部CSS -->
    <link rel="stylesheet" href="css/index.css">

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
    <script src="http://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->

</head>
<body>

<!-- 全局导航 start -->
<nav class="global-header navbar navbar-default navbar-fixed-top">

    <!-- 顶栏 -->
    <div class="global-topbar col-md-12 col-lg-12 hidden-xs visible-sm visible-md visible-lg">
        <ul class="nav navbar-nav navbar-right">
            <li><a href="#">登录</a></li>
            <li><a href="#">注册</a></li>
        </ul>
    </div>

    <!-- logo & 全局导航 -->
    <div class="global-navbar container-fluid">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-6" aria-expanded="false">
                <span class="sr-only">折叠/展开导航</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#">
                <img src="images/logo.svg" width="250" height="50" border="0">
            </a>
        </div>

        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-6">
            <ul class="nav navbar-nav pull-right">
                <li class="active"><a href="#">首页</a></li>
                <li><a href="#">项目管理</a></li>
                <li><a href="#">客户管理</a></li>
                <li><a href="#">应用中心</a></li>
                <li class="reverse"><a href="#">创建活动</a></li>
                <li><a href="#">下载APP</a></li>
            </ul>
        </div>
    </div>

</nav>
<!-- 全局导航 end -->

<!-- 巨幕 start -->
<section class="global-slider">
    <section class="jumbotron">
        <div class="container-fluid">
            <h1>圈子管家, 您的客户营销管理专家</h1>

            <p>一站解决商家B2C的客户营销管理需求</p>

            <p><a class="btn btn-primary btn-lg" href="#" role="button">点击下载</a></p>
        </div>
    </section>
    <section class="side-panel">
        <form class="form-horizontal side-form J_FormRegStep1">
            <h3>免费注册</h3>

            <div class="form-group">
                <label for="mobile" class="col-sm-3 control-label">手机号</label>

                <div class="col-sm-9">
                    <input type="number" min="0" class="form-control" id="mobile" name="mobile" placeholder="请输入手机号" required>
                </div>
            </div>
            <div class="form-group">
                <label for="smsAuthCode" class="col-sm-3 control-label">验证码</label>

                <div class="col-sm-9">
                    <div class="input-group">
                        <input type="text" class="form-control" id="smsAuthCode" name="smsAuthCode" placeholder="点击右侧按钮发送短信" required>
                        <span class="input-group-btn">
                            <button class="btn btn-default" type="button">获取短信验证码</button>
                        </span>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <label for="mobile" class="col-sm-3 control-label">密码</label>

                <div class="col-sm-9">
                    <input type="password" class="form-control" id="password" name="password" placeholder="请输入密码" required>
                </div>
            </div>
            <div class="form-group">
                <label for="mobile" class="col-sm-3 control-label">确认密码</label>

                <div class="col-sm-9">
                    <input type="password" class="form-control" id="recheckPassword" name="recheckPassword" placeholder="请再次输入密码" required>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <div class="checkbox">
                        <label>
                            <input type="checkbox" required> 我已阅读并同意《圈子管家服务使用协议》
                        </label>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-offset-3 col-sm-6">
                    <button type="submit" class="btn btn-primary btn-lg btn-block">注册</button>
                </div>
            </div>
            <div class="form-group text-center">
                <div class="col-sm-offset-3 col-sm-6">
                    我已经有帐号, 我要 <a href="login.html">登录</a>
                </div>
            </div>
        </form>

        <!-- 注册流程第二部分 -->
        <form class="form-horizontal side-form J_FormRegStep2 disn">
            <h3>完善信息</h3>

            <div class="form-group">
                <p class="col-sm-12">
                    <label for="mobile" class="control-label">
                        商户或组织名称
                        <span class="text-danger">*</span>
                    </label>
                </p>
                <div class="col-sm-12">
                    <input type="text" class="form-control" id="merchantName" name="merchantName" placeholder="请输入名称" required>
                </div>
            </div>

            <div class="form-group">
                <p class="col-sm-12"><label for="merchantCity">地址<span class="text-danger">*</span></label></p>
                <div class="col-sm-4">
                    <input type="text" class="form-control col-md-4" id="merchantCity" name="merchantCity" placeholder="所在城市" required>
                </div>
                <div class="col-sm-8">
                    <input type="text" class="form-control col-md-8" id="merchantAddress" name="merchantAddress" placeholder="请输入具体地址" required>
                </div>
            </div>

            <div class="form-group">
                <p class="col-sm-12">
                    <label for="mobile" class="control-label">
                        电话
                        <span class="text-danger">*</span>
                    </label>
                </p>
                <div class="col-sm-12">
                    <input type="number" min="0" class="form-control" id="merchantPhone" name="merchantPhone" placeholder="请输入电话" required>
                </div>
            </div>

            <div class="form-group">
                <p class="col-sm-12">
                    <label for="mobile" class="control-label">
                        邀请码
                    </label>
                </p>
                <div class="col-sm-12">
                    <input type="text" class="form-control" id="inviteCode" name="inviteCode" placeholder="请输入与您联系的邀请码">
                </div>
            </div>

            <div class="form-group">
                <div class="col-sm-offset-3 col-sm-6">
                    <button type="submit" class="btn btn-primary btn-lg btn-block">完成</button>
                </div>
            </div>

        </form>

    </section>
</section>
<!-- 巨幕 end -->

<!-- 主体内容 start -->
<div class="container-fluid">

</div>
<!-- 主体内容 end -->

<!-- 全局底部 start -->
<footer class="global-footer">

    <div class="container">
        <div class="partner">
            <h5 class="title">圈子管家合作伙伴</h5>
            <ul class="list">
                <li class="item"><a href="javascript:">搜狐IT</a></li>
                <li class="item"><a href="javascript:">网易科技</a></li>
                <li class="item"><a href="javascript:">新浪科技</a></li>
                <li class="item"><a href="javascript:">中国企业家</a></li>
                <li class="item"><a href="javascript:">新浪创业</a></li>
                <li class="item"><a href="javascript:">TechWeb</a></li>
                <li class="item"><a href="javascript:">腾讯财经</a></li>
                <li class="item"><a href="javascript:">投资中国网</a></li>
                <li class="item"><a href="javascript:">天下网商</a></li>
                <li class="item"><a href="javascript:">雷锋网</a></li>
                <li class="item"><a href="javascript:">传媒梦工场</a></li>
                <li class="item"><a href="javascript:">cnbeta</a></li>
                <li class="item"><a href="javascript:">福布斯中文网</a></li>
                <li class="item"><a href="javascript:">MSN中文网</a></li>
                <li class="item"><a href="javascript:">News+</a></li>
                <li class="item"><a href="javascript:">巨牛网导航</a></li>
                <li class="item"><a href="javascript:">电科技</a></li>
                <li class="item"><a href="javascript:">人人都是产品经理</a></li>
                <li class="item"><a href="javascript:">搜我们</a></li>
                <li class="item"><a href="javascript:">经理人分享</a></li>
                <li class="item"><a href="javascript:">IT之家</a></li>
                <li class="item"><a href="javascript:">央广网</a></li>
            </ul>
            <p></p>

            <p class="logos">
                <img src="images/logo.svg" width="97" height="44" alt="圈子管家"/>
            </p>
        </div>

        <div class="copyright">

            <ul class="list">
                <li class="item"><a href="javascript:">关于圈子管家</a></li>
                <li class="item"><a href="javascript:">法律声明</a></li>
                <li class="item"><a href="javascript:">联系圈子管家</a></li>
                <li class="item"><a href="javascript:">合作伙伴</a></li>
            </ul>
            <p></p>

            <p>Copyright © 2015 圈子管家网. All Rights Reserved.</p>

            <p><a href="http://www.miitbeian.gov.cn/">京ICP备 15689789 号</a>. 京公网安备11010802015689号</p>

        </div>
    </div>

</footer>
<!-- 全局底部 end -->

<!-- jQuery -->
<script src="node_modules/jquery/dist/jquery.min.js"></script>
<!-- AngularJS -->
<script src="node_modules/angular/angular.min.js"></script>
<script src="node_modules/angular-animate/angular-animate.min.js"></script>
<!-- Angular UI for Bootstrap TODO:做响应式nav的时候, 暂时存在一些问题 -->
<!--<script src="node_modules/angular-ui-bootstrap/ui-bootstrap.min.js"></script>
<script src="node_modules/angular-ui-bootstrap/ui-bootstrap-tpls.min.js"></script>-->
<!-- Bootstrap -->
<script src="plugins/bootstrap/js/bootstrap.min.js"></script>

</body>
</html>